<template>
    <div class="page-common-layout">
      <div class="page-common-content">
        <tool-bar
            @search="localSearch(parameter.secrecyName, parameter.secrecyCode)"
            @reset="() => {(parameter = {}), $refs.masterList.refresh(true);}
        ">
          <template slot="toolBtn" slot-scope="scope">
              <a-button class="cu-btn-primary" icon="plus" @click="handleAdd">
                新增密级
              </a-button>
          </template>
          <!-- <template slot="toolForm">
            <a-form-item label="名称">
              <a-input v-model="parameter.secrecyName" placeholder="请输入名称"/>
            </a-form-item>
            <a-form-item label="编码">
              <a-input v-model="parameter.secrecyCode" placeholder="请输入编码"/>
            </a-form-item>
          </template> -->
        </tool-bar>
        <TreeGrid
            ref="masterList"
            :columns="masterColumns"
            :url="url"
            rowKey="uuid"
            :loadAll="true"
            :parameter="parameter"
            :showRowSelect="false"
            @rowClick="masterRowClick"
        >
          <span slot="rendersecrecyStatus" slot-scope="{ text }">
            <a-tag :color="text === 'true' ? 'green' : 'red'">
              {{ text | statusFilter }}
            </a-tag>
          </span>
          <span slot="renderAction" slot-scope="{ record }">
            <template>
              <a @click="handleEdit(record)">编辑</a>
              <span class="action-margin"></span>
              <a-popconfirm title="是否要删除？" @confirm="handleDel(record)">
                <a class="action-delete">删除</a>
							</a-popconfirm>
            </template>
          </span>
        </TreeGrid>
      </div>

      <editForm
        ref="editModal" 
        :visible="editVisible"
        :title="editTitle"
        :model="editModel"
        @cancel="() => {editVisible = false, editModel = {}}"
        @ok="handleOk()"
      />
    </div>
  </template>
  
  <script>
  import {TreeGrid} from "@/components";
  import {treeGridMixin} from "@/mixins/treeGridMixin";
  import editForm from "./edit.vue"
  
  export default {
    name: "Table",
    components: {
          TreeGrid,
          editForm,
      },
    mixins: [treeGridMixin],
    data() {
      return {
        masterColumns: [
          {
            title: "名称",
            align: "left",
            dataIndex: "secrecyName",
            width: 250,
          },
          {
            title: "编码",
            dataIndex: "secrecyCode",
            width: 250,
          },
          {
            title: "状态",
            dataIndex: "secrecyStatus",
            width: 80,
            align: "center",
            scopedSlots: {customRender: "rendersecrecyStatus"},
          },
          {
            title: "排序",
            dataIndex: "secrecySort",
            width: 50,
            align: "center",
          },
          {
            title: "操作",
            width: 150,
            align: "center",
            dataIndex: "action",
            scopedSlots: {customRender: "renderAction"},
          },
        ],
        // 查询参数
        url: {
          fathersUrl: "/system/sysSecrecy/getTreeSysSecrecy",
          expandUrl: "/mdata/organization/getListByPid",
          masterUpdate: "/system/sysSecrecy/update",
          masterDelete: "/system/sysSecrecy/deleteBatch",
          masterSave: "/system/sysSecrecy/save",
          getListByKeywords: "/mdata/user/getListByKeywords",
          getDicItemByCode: "/system/dicSet/getDicItemByCode",
        },
        parameter: {},
        editVisible: false,
        editModel: {},
        editTitle: null,
      };
    },
      filters: {
        statusFilter(status) {
          const statusMap = {
            "true": "启用",
            "false": "关闭",
          };
          return statusMap[status];
        },
      },
    methods: {
      // 查询
      localSearch(name,code) {
        this.$post(this.url.fathersUrl,{
          secrecyName: name,
          secrecyCode: code,
        }).then(res => {
          console.log(res);
        })
      },
      // 新增
      handleAdd() {
        this.editVisible = true;
        this.editTitle = '新增密级';
      },
      // 编辑
      handleEdit(record) {
        this.editModel = record;
        this.editVisible = true;
        this.editTitle = '编辑密级';
      },
      // 删除
      handleDel(record) {
        this.$post(this.url.masterDelete, {uuid:record.uuid}).then(res => {
          if (res.statusCode === 200) {
            this.$message.success('删除成功');
            this.$refs.masterList.refresh();
          } else {
            this.$message.error(res.message);
          }
        })
      },
      // 提交表单
      handleOk() {
        let form = this.$refs.editModal.form;
        form.validateFields((errors, values) => {
          if (!errors) {
            if (typeof values.uuid === 'undefined') {
              this.$post(this.url.masterSave, values).then(res => {
                if (res.statusCode === 200) {
                  this.$message.success('保存成功');
                  this.editVisible = false;
                  this.$refs.masterList.refresh();
                }else {
                  this.$message.success(res.message);
                }
              })
            } else {
              this.$post(this.url.masterUpdate, values).then(res => {
                if (res.statusCode === 200) {
                  this.$message.success('更新成功');
                  this.editVisible = false;
                  this.$refs.masterList.refresh();
                }else {
                  this.$message.success(res.message);
                }
              })
            }
          }
        })
      },
    },
  };
  </script>
  
  <style scoped lang="less">
    .table {
      background-color: @base-bg-color;
      padding: 24px;
    }
  </style>
  